/**
 * CommonMask
 */

 var React = require("react");
 var CommonMask = React.createClass({
    getDefaultProps: function (){
        return {
            data: {},
            type: "",
            playing: false,
            play: function (){}
        }
    },
    handleOnEdit: function (type){
        const {updateState} = this.props;
        updateState("dialog", type);
    },
    handleOnDelete: function (type, e){
        this.props.updateState({
            delete: type,
            dialog: "deleteDetail"
        });
    },
    render: function (){
        var type = this.props.type, playing = this.props.playing, play = this.props.play;

        var isVideoItem = type === "video";
        var videoControl = "";
        if (isVideoItem){
            videoControl = <i onClick={ play } className={"mask-icon" + (playing ? " stop" : " play")}></i>
        }

        return (
            <div className="details-mask">
                <div className={"mask-content" + (isVideoItem ? " video" : "")}>
                    { videoControl }
                    <i className="mask-icon edit" onClick={this.handleOnEdit.bind(this, type)}></i>
                    <i className="mask-icon delete" onClick={this.handleOnDelete.bind(this, type)}></i>
                </div>
            </div>
        )
    }
 });

 module.exports = CommonMask;
